var categroys = [];
var titles = [];
var num = [];
var btn = 0;
layui.use(['jquery','layer','table','form','upload'],function(){
    var $=layui.jquery;
    var layer=layui.layer;
    getNum();

    function getNum() {
        $.ajax({
            url: '/JsStatistical/getUser',
            dataType: 'json',
            type: 'post',
            success: function (data) {
                var users = data.data;
                setVal(users);
            }
        });
    }
    function setVal(data){
        categroys = [];
        titles = [];
        num = [];
        $('#userNum').text('');
        $('#userNum').append('<td>' + '总人数' + '</td>');
        $('#userNum').append('<td>' + data[0] + '</td>');
        $('#userNum').append('<td>' + data[1] + '</td>');
        titles[0] = "前端用户人员";
        titles[1] = "后台管理人员";
        num[0] = data[0];
        num[1] = data[1];
        var beforeUser = {value:num[0],name:titles[0]}
        var backstageUser = {value:num[1],name:titles[1]}
        categroys[0] = beforeUser;
        categroys[1] = backstageUser;
        circular();
    }
    //刷新
    $('#refresh').click(function () {
        location.reload();
    })
    //返回
    $('#goBack').click(function () {
        parent.tabParentChange(3);
    })
    $(document).click(function () {
        parent.$('.rightMenu').hide();
    });
    //统计图刷新
    reload = function reload(){
        getNum()
    }
})

var option;
//扇形统计图
function circular(){
    var chartDom = document.getElementById('main');
    var myChart = echarts.init(chartDom);
    option = {
        series: [
            {
                type: 'pie',
                data: categroys,
                roseType: 'area'
            }
        ],
        xAxis: {
            show: false
        },
        yAxis: {
            show: false
        }
    };
    option && myChart.setOption(option);
}
//折线统计图
function strip() {
    var chartDom = document.getElementById('main');
    var myChart = echarts.init(chartDom);
    //var option;
    option = {
        xAxis: {
            show: true,
            type: 'category',
            data: titles
        },
        yAxis: {
            show: true,
            type: 'value'
        },
        series: [
            {
                data: num,
                type: 'line'
            }
        ]
    };
    option && myChart.setOption(option);
}
//柱状统计图
function column(){
    var chartDom = document.getElementById('main');
    var myChart = echarts.init(chartDom);
    //var option;
    option = {
        xAxis: {
            show: true,
            data: titles
        },
        yAxis: {show: true},
        series: [
            {
                type: 'bar',
                data: num
            }
        ]
    };
    option && myChart.setOption(option);
}
//下载图表
function downLoad(){
    var canvas = document.getElementsByTagName("canvas")
    if (canvas && canvas.length > 0) {
        var oA = document.createElement("a")
        oA.download = "Echarts图表" + ".png"
        oA.href = canvas[0].toDataURL("image/png")
        document.body.appendChild(oA)
        oA.click()
        oA.remove()
    }
}